@extends('backend.layouts.app')

@section('styles')
<link rel="stylesheet" href="{{asset('/backend/js/ztree/css/metroStyle/metroStyle.css')}}">
@endsection

@section('content')
<div class="layui-row layui-col-space15">
    <div class="layui-col-md3">
        <div class="layui-card">
            <div class="layui-card-header layui-card-header-auto">
                设置(<span style="color:blue;font-weight:bold;">{{$config->name}}</span>)权重
            </div>
            <div class="layui-card-content">
                <ul class="ztree" id="dataitemTree"></ul>
            </div>
        </div>
    </div>
    <div class="layui-col-md9">
        <div class="layui-card">
            <div class="layui-card-header layui-card-header-auto" id="item_title">
            </div>
            <div class="layui-card-body">
                <div class="layui-form" id='content'>
                    @csrf
                    <div class="layui-row">
                        <input type="hidden" id="config_id" name="config_id" value="{{$config->config_id}}">
                    </div>
                    <div class="layui-row" id="contents">
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn" onClick="Test()">确 认</button>
                            <a class="layui-btn" href="{{route('admin.resume.evaluation.config.index')}}">返 回</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


@endsection

@section('script')
<script type="text/javascript" src="{{asset('/backend/js/ztree/js/jquery.ztree.all.js')}}"></script>
<script type="text/javascript">
    layui.use(['form', 'layer'], function () {
        let form = layui.form;
        $.ajax({
            data: {
                config_id: $("#config_id").val()
            },
            url: "{{route('admin.resume.evaluation.config.content.items')}}",
            success: function (data) {
                let treeData = data.tree;
                let contentData = data.content;
                $.fn.zTree.init($("#dataitemTree"), {
                    view: {
                        showIcon: false,
                        showLine: false,
                        nameIsHTML: true
                    },
                    callback: {
                        onClick: function (event, treeId, treeNode) {
                            $('#item_title').html(treeNode.remark);
                            $('.contents_item').hide();
                            $('#' + treeNode.code).show();
                        }
                    }
                }, treeData);
                $("#contents").append(contentData);
                $("#item_title").html("总版块设置");
                $("#full_div").show();
            }
        });
    });

    function Test() {
        let verify = [];
        let flag = true;
        $('.contents_item').each(function () {
            if (!getVerifyResult(this.id)) {
                verify.push(this.id);
            }
        });
        if (verify.length > 0) {
            setNodes(verify);
            flag = false;
        }
        if (flag) {
            let datas = [];
            let config_id = $("input[name='config_id']").val();
            $('#contents input').each(function () {
                datas.push({
                    name: this.dataset.name,
                    config_id: config_id,
                    block_id: this.dataset.id,
                    weight: this.value
                });
            });
            let data = {
                _token: $("input[name='_token']").val(),
                datas: datas
            };
            $.ajax({
                type: 'POST',
                url: "{{route('admin.resume.evaluation.config.content.store')}}",
                data: data,
                success: function (data) {
                    if (data.flag) {
                        layer.msg(data.message);
                        window.location.href = "{{route('admin.resume.evaluation.config.index')}}";
                    }
                }
            });
        }
    }

    function getVerifyResult(id) {
        let sum = 0.0;
        $("#" + id + " input").each(function () {
            sum += parseFloat(this.value);
        });
        return sum == 100.0;
    }

    function setNodes(noVerify) {
        let ztree = $.fn.zTree.getZTreeObj("dataitemTree");
        let nodes = ztree.getNodesByFilter(function (node) {
            return node.code != '';
        }, false);
        for (var i = 0; i < nodes.length; i++) {
            nodes[i].name = nodes[i].setname;
            ztree.updateNode(nodes[i]);
        }
        let newNames = ztree.getNodesByFilter(function (node) {
            return $.inArray(node.code, noVerify) >= 0;
        }, false);
        for (var i = 0; i < newNames.length; i++) {
            newNames[i].name = '<span style="color:red">' + newNames[i].setname + '</span>';
            ztree.updateNode(newNames[i]);
        }
        ztree.expandAll(true);
    }

</script>
@endsection
